<template>
  <div>
    <div class="zscf_block3 pt30 ">
      <h2 class="block3_tit clearfix">
        <span class="block3_curspan">项目列表</span><a href="#">更多&gt;</a>
      </h2>
      <div class="block3_pro_box clear">
        <div class="block3_prolist">
          <div v-for="(item,index) in projects" :key="index" class="block3_proone clearfix clear projects">
            <div class="project_logo">
              <img :src="item.logo" alt="logo">
            </div>
            <div class="project_content">
              <div class="project_title">
                <h1>{{ item.title }}</h1>
              </div>
              <div class="project_type">
                <p><span>所属行业：</span><em>{{ item.industry.title }}</em></p>
                <p><span>所在区域：</span><em>{{ item.area.title }}</em></p>
                <p><span>创业类型：</span><em>{{ item.type.title }}</em></p>
              </div>
              <div class="project_type">
                <p><span>投资金额：</span><em>{{ item.money.title }}</em></p>
                <p><span>消费人群：</span><em>{{ item.crowd.title }}</em></p>
                <p><span>店面位置：</span><em>{{ item.position.title }}</em></p>
              </div>
            </div>
            <div class="project_go">
              <nuxt-link :to="`/item/${item._id}`" class="project_go_link">
                查看详情
              </nuxt-link>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Projects',
  props: {
    projects: {
      type: Array,
      default: () => [
      ]
    }
  }
}
</script>
<style lang="scss" scoped>
.projects{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  .project_logo{
    width: 192px;
    height: 120px;
    overflow: hidden;
    img{
      width: 100%;
    }
  }
  .project_content{
    margin-left: 10px;
    padding-left: 30px;
    flex: 1;
    .project_title{
      font-size: 30px;
      margin-bottom: 30px;
    }
    .project_type{
      display: flex;
      p{
        display: block;
        flex: 1 0 33%;
      }
    }
  }
  .project_go{
    .project_go_link{
      display: block;
      width: 120px;
      height: 36px;
      background: url(/images/block3_btn.png) no-repeat scroll center center;
      line-height: 36px;
      text-align: center;
      font-size: 16px;
      color: #fff;
    }
  }
}
</style>
